@extends('layouts.admin.application')

@section('content')
    <div class="main-content">
        <div class="col-xs-12">
            <div class="breadcrumbs" id="breadcrumbs">
                <ul class="breadcrumb">
                    <li><i class="icon-home home-icon"></i><a href="{{ route('blog.gallery.index') }}">首页</a></li>
                    <li>照片回收站</li>
                </ul>
            </div>

            @include('layouts.partials._flash')

            <div class="table-responsive">
                <div id="sample-table-2_wrapper" class="dataTables_wrapper" role="grid">
                    <div class="row">
                        <h5 style="margin-left: 15px;">回收站列表</h5>
                        <hr>
                        <div class="col-xs-12">
                            <ul class="ace-thumbnails">

                                @foreach($photos as $photo)
                                    <li data-id="{{$photo->id}}">
                                        <a href="javascript:;" data-rel="colorbox">
                                            <img alt="150x150" style="width: 150px;height: 100px;"
                                                 src="{{$photo->image}}">
                                            <div class="tags">
                                                <span class="label-holder">
                                                    @if($photo->gallery['type'] == 1)
                                                        <span class="label label-default">普通</span>
                                                    @elseif($photo->gallery['type'] == 2)
                                                        <span class="label label-purple">亲子</span>
                                                    @else
                                                        <span class="label label-info">旅游</span>
                                                    @endif
                                                </span>

                                                <span class="label-holder">
                                                    <span class="label label-success">{{$photo->gallery['name']}}</span>
                                                </span>
                                            </div>
                                        </a>
                                        <div style="text-align: center;margin:10px 0 5px 0;">
                                            <span>{{$photo->name}}</span>
                                        </div>

                                        <div class="tools tools-top">
                                            <a href="javascript:;" class="restore_one">
                                                <i class="icon-share-sign"></i>
                                            </a>
                                            <a href="javascript:;">
                                                <i class="icon-remove red del_one"></i>
                                            </a>
                                        </div>
                                    </li>
                                @endforeach
                            </ul>
                        </div><!-- /.col -->
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script>
        $(function () {

            //ajax删除单张照片
            $('.del_one').click(function () {
                var id = $(this).parents('li').data('id');
                var _this = $(this);
                $.ajax({
                    type: 'DELETE',
                    url: '/admin/blog/photo/' + id + '/force_destroy',
                    data: id,
                    success: function () {
                        _this.parents('li').fadeOut(400);
                    }
                })
            });

            //ajax还原单张照片
            $('.restore_one').click(function () {
                var id = $(this).parents('li').data('id');
                var _this = $(this);
                $.ajax({
                    type: 'POST',
                    url: '/admin/blog/photo/' + id + '/restore',
                    data: id,
                    success: function () {
                        _this.parents('li').fadeOut(400);
                    }
                })
            })
        })
    </script>
@endsection